<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>工单统计列表</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../css/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="css/comm.css" />
    <link rel="stylesheet" type="text/css" href="css/analysis_historyfeesummary.css" />
    <link rel="stylesheet" type="text/css" href="css/customerservicelist.css" />
    <link rel="stylesheet" type="text/css" href="../script/mui/mui.picker.min.css" />
    <link rel="stylesheet" type="text/css" href="../script/mui/mui.reset.css" />
    <style>
        .menu_tapmode {
            width: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
        }
        .list_txt span{
            border-left: none;
            padding-left: 15px;
        }
        .item-content{
            font-size: 0.8rem;
        }
        .item-content.spanum span{
            font-size: 0.7rem;
            margin-left: 5px;
        }
        .item_checked{
            border:solid 0.5px #289fff;
        }
    </style>
</head>

<body>
    <div id="app" v-cloak>
        <!-- <header class="topheader" id="aui-header" style="background:#289FFF;">
            <div class="aui_tab_box" style=" width: 98%; float: right;">
                <div class="aui-tab aui-tab-color" style="background: #289FFF;  padding-bottom: 8px; width: 100%;">
                    <div v-on:click="do_select_item(0)" class="aui-tab-item menu_tapmode"
                         style="margin-left: 10px;">
                        <div v-bind:class="{'aui-active':menuitem_selected==0}">
                            <label class="labelbox">
                                工单明细
                            </label>
                        </div>
                    </div>
                    <div v-on:click="do_select_item(1)" class="aui-tab-item menu_tapmode">
                        <div v-bind:class="{'aui-active':menuitem_selected==1}">
                            <label class="labelbox">
                                汇总分析
                            </label>
                        </div>
                    </div>
                    <div class="cl">
                    </div>
                </div>
            </div>
        </header> -->
        <!-- 弹框黑色背景 -->
        <div v-on:click="doHideSearch()" v-if="showsearch" class="maskbg">
        </div>
        <!-- //项目筛选 -->
        <div v-if="showsearchparam" class="searchparam" style=" height: 70%;">
            <div class="searchcontent" style="height: 100%;">
                <div class="searchparamtitle">
                    工单状态
                </div>
                <div class="searchparamitem">
                    <label v-on:click="doSelectstatus(item.ID)" v-bind:class="{'active':form.statusListIDS.indexOf(item.ID)>-1}" v-for="item in statusList">{{item.Name}}</label>
                </div>
                <div class="searchparamtitle">
                    项目名称
                </div>
                <div class="searchparamitem">
                    <label v-on:click="doSelectProject(item.ID)" v-bind:class="{'active':form.ProjectIDs.indexOf(item.ID)>-1}" v-for="item in projectList">{{item.Name}}</label>
                </div>
                <div class="aui_bottom">
                    <div v-on:click="doReset(1)" class="aui_bottombtn left">重置</div>
                    <div v-on:click="doSearch()" class="aui_bottombtn right">确认</div>
                </div>
            </div>
        </div>
        <!-- 时间筛选 -->
        <div v-if="showsearchmonth" class="searchparam" >
            <div class="searchparamtitle">
                工单报修时间
            </div>
            <div class="searchparamitem">
                <label v-bind:class="{'active':form.activeDate==1}" v-on:click="doClickDay(1)">今日</label>
                <label v-bind:class="{'active':form.activeDate==2}" v-on:click="doClickDay(2)">本月</label>
                <label v-bind:class="{'active':form.activeDate==3}" v-on:click="doClickDay(3)">本年</label>
            </div>
            <div class="searchparamtitle">
                自定义
            </div>

            <div class="searchparamitem searchparamitem_input">
                <i class="icon iconfont icon-rili"></i>
                <span class="choose new-span-date" id="startdate" data-options='{"type":"date"}' v-bind:class="{'textColorPlaceholder':form.startTime==''}">{{form.startTime==''?'开始日期':form.startTime}}</span>
                <!--<input v-on:click="do_select_time(1)" v-model="form.startTime" readonly="readonly" type="text" placeholder="开始日期">-->
                <span style="padding: 0 10px;">
                    至
                </span>
                <span class="choose new-span-date" id="enddate" data-options='{"type":"date"}' v-bind:class="{'textColorPlaceholder':form.endTime==''}">{{form.endTime==''?'结束日期':form.endTime}}</span>
                <!--<input v-on:click="do_select_time(2)" v-model="form.endTime" readonly="readonly" type="text" placeholder="结束日期">-->
            </div>


            <!-- <div class="searchparamitem">
                <input v-on:click="do_select_time(1)" readonly="readonly" v-model="form.startTime" type="text" placeholder="开始日期">
                <span style="padding: 0 10px;">
                  至
                </span>
                <input v-on:click="do_select_time(1)" readonly="readonly" v-model="form.endTime" type="text" placeholder="结束日期">
            </div> -->
            <div class="aui_bottom">
                <div v-on:click="doReset(2)" class="aui_bottombtn left">重置</div>
                <div v-on:click="doSearch()" class="aui_bottombtn right">确认</div>
            </div>
        </div>
        <div class="search_box bgshadow" v-bind:class="{'fixedbox':showsearch}" style=" background: #fff;">
            <div class="searchitem" v-bind:class="{'chkedbox':showsearchparam}" v-on:click="doSelectSearchParam(1)">
                筛选
                <i v-if="!showsearchparam" class="icon iconfont icon-down"></i>
                <i v-if="showsearchparam" class="icon iconfont icon-shangjiantou" style="color:#fff;"></i>
            </div>
            <div class="searchitem" v-bind:class="{'chkedbox':showsearchmonth}" v-on:click="doSelectSearchParam(2)">
                {{form.activeDateDesc}}
                <i v-if="!showsearchmonth" class="icon iconfont icon-down"></i>
                <i v-if="showsearchmonth" class="icon iconfont icon-shangjiantou" style="color:#fff;"></i>
            </div>
        </div>

        <!-- 工单明细 -->
        <div class="aui-content" v-if="menuitem_selected==0" style="margin-top: 0.5rem;">
            <div class="list_txt"><span>{{form.startTime}} 至 {{form.endTime}} 统计</span> 
                <span style="float: right; font-size: 0.7rem; line-height: 1rem; margin-right: 15px; color:#828c9a;" v-on:click="do_open_tongji()">统计 <i style="font-size: 0.6rem; position: relative; top:-1px" class="icon iconfont icon-xiangyoujiantou"></i></span></div>
            <div class="boxarea mainbox">
                <div class="app_list_txt">
                    <span>工单进度</span>
                    <!-- <i class="icon iconfont icon-down" v-if="isOpenJD==false" v-on:click="do_openJD()" style="float: right; color: #CACED2;"></i>
                    <i class="icon iconfont icon-shangjiantou" v-if="isOpenJD==true" v-on:click="do_openJD()" style="float: right; color: #CACED2;"></i> -->
                </div>
                <!-- <div class="gd-contain mt10">
                    <div class="con-item mb10">
                        <div class="item-box">
                            <div class="item-name">未关闭工单</div>
                            <div class="item-content">{{summary.NoCloseNumber}}</div>
                        </div>
                    </div>
                </div> -->
                <div class="gd-contain mt10" >
                    <div class="con-itemfl fl" v-bind:class="{'item_checked':statusid==4}">
                        <div class="item-box" v-on:click="do_chooseservice(4)">
                            <div class="item-name">待受理</div>
                            <div class="item-content spanum">{{summary.AcceptUmber>0?summary.AcceptUmber:0}}<span>张</span></div>
                        </div>
                    </div>
                    <div class="con-itemfl  fr" v-bind:class="{'item_checked':statusid==5}">
                        <div class="item-box" v-on:click="do_chooseservice(5)">
                            <div class="item-name">待派单</div>
                            <div class="item-content spanum">{{summary.SendNumber>0?summary.SendNumber:0}}<span>张</span></div>
                        </div>
                    </div>
                    <div class="con-itemfl  fl" v-bind:class="{'item_checked':statusid==10}">
                        <div class="item-box" v-on:click="do_chooseservice(10)">
                            <div class="item-name">待接单</div>
                            <div class="item-content spanum">{{summary.AcceptOrderNumber>0?summary.AcceptOrderNumber:0}}<span>张</span></div>
                        </div>
                    </div>
                    <div class="con-itemfl  fr" v-bind:class="{'item_checked':statusid==0}">
                        <div class="item-box" v-on:click="do_chooseservice(0)">
                            <div class="item-name">处理中</div>
                            <div class="item-content spanum">{{summary.HandleNumber>0?summary.HandleNumber:0}}<span>张</span></div>
                        </div>
                    </div>
                    <div class="con-itemfl  fl" v-bind:class="{'item_checked':statusid==1}">
                        <div class="item-box"  v-on:click="do_chooseservice(1)">
                            <div class="item-name">已完工</div>
                            <div class="item-content spanum">{{summary.CompleteNumber>0?summary.CompleteNumber:0}}<span>张</span></div>
                        </div>
                    </div>
                    <div class="con-itemfl  fr" v-bind:class="{'item_checked':statusid==50}">
                        <div class="item-box"  v-on:click="do_chooseservice(50)">
                            <div class="item-name">已关单</div>
                            <div class="item-content spanum">{{summary.CloseNumber>0?summary.CloseNumber:0}}<span>张</span></div>
                        </div>
                    </div>

                </div>

            </div>
            <div class="boxarea mainbox" v-if="roomlist.length>0" v-for="item in roomlist" v-on:click="do_open_gongdan(item,1)">
                <div class="work_con_box">
                    <div class="workheader">
                        <div class="work_title_add ellipsis_one fl" style="font-weight: bold;width: 60%;">{{item.TypeName}}</div>
                        <div v-if="item.ServiceStatusDesc=='待受理'" class="typestatus dsl">待受理</div>
                        <div v-if="item.ServiceStatusDesc=='待派单'" class="typestatus dpd">待派单</div>
                        <div v-if="item.ServiceStatusDesc=='待接单'" class="typestatus dsl">待接单</div>
                        <div v-if="item.ServiceStatusDesc=='处理中'" class="typestatus clz">处理中</div>
                        <div v-if="item.ServiceStatusDesc=='已完工'" class="typestatus ywg">已完工</div>
                        <div v-if="item.ServiceStatusDesc=='已归档'" class="typestatus ygd">已关单</div>
                        <div v-if="item.UrgencyStatus==1" class="typestatus kgx">紧急</div>
                    </div>
                    <div class="work_con_box_time marginheight">
                        <div class="work_con_box_left">资源位置</div>
                        <div class="work_con_box_right">
                            <label>{{item.FullName}}</label>
                        </div>
                    </div>
                    <div class="work_con_box_time marginheight">
                        <div class="work_con_box_left">区&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;域</div>
                        <div class="work_con_box_right">
                            <!-- <span v-if="item.OutTimeStatusDesc=='超时'" class="overtime">{{item.OutTimeStatusDesc}}</span> -->
                            <label>{{item.ServiceArea}}</label>
                        </div>
                    </div>
                    <div class="work_con_box_time marginheight">
                        <div class="work_con_box_left">报修时间</div>
                        <div class="work_con_box_right">
                            <!-- <span v-if="item.OutTimeStatusDesc=='超时'" class="overtime">{{item.OutTimeStatusDesc}}</span> -->
                            <label>{{item.AddTime}}</label>
                        </div>
                    </div>
                    <div class="work_con_box_time marginheight work_con_box_contain">
                        {{item.ServiceContent}}
                    </div>
                </div>
            </div>
            <div v-if="roomlist.length<=0" class="nodata">暂无数据</div>

        </div>



    </div>
</body>
<script type="text/javascript " src="../script/api.js "></script>
<script type="text/javascript " src="../script/vue.js "></script>
<script type="text/javascript" src="../script/config.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript" src="../script/mui/mui.min.js"></script>
<script type="text/javascript" src="../script/mui/mui.picker.min.js"></script>
<script type="text/javascript" src="../script/mui/mui.poppicker.js"></script>
<script type="text/javascript" src="../script/aui-toast.js"></script>
<script type="text/javascript" src="../script/page/dateRangeUtil.js"></script>
<script type="text/javascript" src="../script/highcharts/highcharts.js"></script>
<script type="text/javascript" src="../script/highcharts/modules/exporting.js"></script>
<script type="text/javascript" src="js/analysis_customerservice_summary.js"></script>
<!-- <script src="https://img.hcharts.cn/highcharts-plugins/highcharts-zh_CN.js"></script> -->


</html>
